<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport"
		  content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Document</title>
	<link href="../Public/css/bootstrap.min.css" rel="stylesheet">
	<script src="../Public/js/jquery-1.11.1.min.js"></script>
	<script src="../Public/js/bootstrap.min.js"></script>
	<style>
		/*重置*/
		*{
			box-sizing: border-box;
			text-size-adjust: none;
			-webkit-text-size-adjust: none;
		}
		html,body,a{
			padding: 0;
			margin: 0;
			height: 100%
		}

		img{
			max-width: 100%;
		}
		.a{
			position: relative;max-width: 420px;min-width: 320px;margin: auto
		}
		/*布局*/
		.a{
			height: 1155px;display: flex;flex-direction: column;background-color: #f0f0f0;width: 100%;
		}
		.b{
			max-height: 115px;
			min-height: 0;
			background-color: #f0f0f0;
		}
		.c{
			min-width: 414px;
		}
		.c>*{flex: 1;}
		.b{
			display: flex;
		}
		#b1{
			flex: 1;
		}
		#b2{
			flex: 1;
		}
		#b3{
			flex: 1;
		}
	</style>
</head>
<body>
	<div class="a">
		<div class="c">
			<div style="height: 65px;background-color: #ffffff">
				<img src="images/gg.jpg" style="margin-top: 4px;margin-left: 20px;float: left">
				<img src="images/论坛(2)_09.jpg" style="margin-top: 20px;margin-left: 8px;float: left">
				<img src="images/论坛(2)_06.jpg" style="margin-left: 100px;margin-top: 20px;float: left">
				<div style="font-size: 16.82px;float: left;line-height: 65px;margin-right:15px;" class="pull-right">小葡萄的爸爸</div>
			</div>
		</div>

		<div class="b">
			<div id="b1" style="width: 91px;height: 91px;background-color: #fe8e74;border-radius: 5px;margin-left: 5px;margin-top: 11px">
				<img src="images/论坛(2)_18.jpg" style="padding-top: 18px;padding-left: 30px">
				<div style="color: white;font-size: 19.41px;margin-left: 9px;margin-top: 8px">发布帖子</div>
			</div>
			<div id="b2" style="width: 91px;height: 91px;background-color: #90dfe5;border-radius: 5px;margin-left: 5px;margin-top: 11px">
				<img src="images/论坛(2)_15.jpg" style="padding-top: 18px;padding-left: 30px">
				<div style="color: white;font-size: 19.41px;margin-left: 9px;margin-top: 8px">我的帖子</div>
			</div>
			<div id="b3" style="width: 91px;height: 91px;background-color: #45c9a2;border-radius: 5px;margin-left: 5px;margin-top: 11px">
				<img src="images/论坛(2)_21.jpg" style="padding-top: 18px;padding-left: 30px">
				<div style="color: white;font-size: 19.41px;margin-left: 9px;margin-top: 8px">我的消息</div>
			</div>
			<div id="b4" style="width: 91px;height: 91px;background-color: #edd84b;border-radius: 5px;margin-left: 5px;margin-top: 11px;margin-right: 5px">
				<img src="images/论坛(2)_23.jpg" style="padding-top: 18px;padding-left: 30px">
				<div style="color: white;font-size: 19.41px;margin-left: 9px;margin-top: 8px">我的收藏</div>
			</div>
		</div>
		<div style="margin-top: 14px;min-height: 0;margin-left: 7px;margin-bottom: 0" class="thumbnail">
			<img src="images/论坛(2)_30.jpg">
		</div>
		<div style="margin: 13px auto">
			<div style="float: left">
				<div style="height: 51px;width: 190px;background-color: #fe8e74;border-radius: 5px;color: white;font-size: 20px;line-height: 51px;margin-bottom:5px ">
					<div style="margin-left: 56px">家庭教育</div>
				</div>
				<div style="height: 51px;width: 190px;background-color: #45c9a2;border-radius: 5px;color: white;font-size: 20px;line-height: 51px">
					<div style="margin-left: 56px">妈妈社区</div>
				</div>
			</div>
			<div style="float: left;margin-left: 10px">
				<div style="height: 51px;width: 190px;background-color: #45c9a2;border-radius: 5px;color: white;font-size: 20px;line-height: 51px;margin-bottom:5px">
					<div style="margin-left: 56px">亲子活动</div>
				</div>
				<div style="height: 51px;width: 190px;background-color: #45c9a2;border-radius: 5px;color: white;font-size: 20px;line-height: 51px">
					<div style="margin-left: 56px">育儿问答</div>
				</div>
			</div>
		</div>
		<div style="height: 36px;width: 395px;background-color: #d4d4d4;margin: 0 auto">
			<img src="images/论坛(2)_34.jpg" style="margin-left: 150px;margin-top: 9px;float: left">
			<div style="line-height: 36px;float: left;margin-left: 5px">查看更多</div>
		</div>
		<div style="height: 165px;width: 395px;background-color: #ffffff;margin: 10px auto">
			<div>
				<img src="images/论坛(2)_03.jpg" style="margin-left: 8px;margin-top: 8px;float: left">
				<div style="height: 43px;float: left;margin-left: 8px;margin-top: 8px;">
					<div style="font-size: 19.4px">微信名称</div>
					<div style="font-size: 14.23px;color: #fb4d42">01月08日</div>
				</div>
			</div>

			<div style="margin: 74px auto 52px">
				<div style="font-size: 18.12px;">
					一直都在记录宝宝的言语，这下找到地方晒了，
					呵呵，童言无忌，博大家一笑。
				</div>
				<div class="row" style="margin:0">
					<div class="col-xs-offset-5 col-xs-2" >
						<img src="images/oo.jpg">23
					</div>
					<div class="col-xs-3" style="width: 80px">
						<img src="images/yy_09.jpg">23
					</div>
					<div class="col-xs-3" style="width: 80px">
						<img src="images/yy_06.jpg">23
					</div>
				</div>

			</div>
		</div>

		<div style="height: 348px;width: 395px;background-color: #ffffff;margin: 10px auto">
			<div>
				<img src="images/论坛(2)_03.jpg" style="margin-left: 8px;margin-top: 8px;float: left">
				<div style="height: 43px;float: left;margin-left: 8px;margin-top: 8px;">
					<div style="font-size: 19.4px">微信名称</div>
					<div style="font-size: 14.23px;color: #fb4d42">01月08日</div>
				</div>
			</div>

			<div style="margin: 74px auto 52px;">
				<div style="font-size: 18.12px;">
					一直都在记录宝宝的言语，这下找到地方晒了，
					呵呵，童言无忌，博大家一笑。
				</div>
				<div class="row" style="margin:0">
					<div class="col-xs-offset-5 col-xs-2" >
						<img src="images/oo.jpg">23
					</div>
					<div class="col-xs-3" style="width: 80px">
						<img src="images/yy_09.jpg">23
					</div>
					<div class="col-xs-3" style="width: 80px">
						<img src="images/yy_06.jpg">23
					</div>
				</div>
			</div>
			<div style="border: 0.5px solid gainsboro;margin: -30px auto;width: 100%"></div>

			<div style="margin: 40px;margin-left: 10px">
				<img src="images/rr.jpg" style="float: left">
				<div style="float: left;margin-left: 5px;margin-top: 3px">小葡萄:非常期待</div>
			</div>

			<div style="margin: 40px;margin-left: 10px">
				<img src="images/rr.jpg">
				<div style="margin-left: 5px;margin-top: 3px">小葡萄:非常期待非常期待非常期待非常期待非常</div>
			</div>

			<div style="margin: 40px;margin-left: 10px">
				<img src="images/rr.jpg">
				<div style="margin-left: 5px;margin-top: 3px">小葡萄:非常期待</div>
			</div>

		</div>
	</div>
</body>
</html>